
<div ng-controller="specCtrl" class="wrap">

    <div class="speclHeadImg">
        <img src="{{specHeadImg}}">
    </div>
    <p class="speclHeadText">
        {{specHeadTitlTxt}}
    </p>

    <div-divider></div-divider>
   <!--首页推荐存在-->
   <div class="" ng-if="childGetMouds.length!=0&&specDetaiDataColumns">
       <div class="conWidth mianConLeft" style="padding-top: 0.2rem">
           <div ng-repeat="item in specDetaiDataColumns track by $index">
               <!--ng-repeat-->
               <div class="speclHeadTitl">
                   <span class="speclHeadTitl1">{{$index+1}}/{{specDetaiDataColumns.length}} {{item.columnName}}</span>
                   <span ng-click="jump('/detailSpec/'+item.columnId+'linkId'+speciParentColumnId)" class="speclHeadMor">更多</span>
               </div>
               <div ng-include="'tpl/components/detailSpeFouTwo.html'"></div>
           </div>
       </div>
       <!--头条-->
       <div class="conAside conGroomConti" style="background: #ffffff;padding-bottom: 0.2rem">
           <div ng-include="'tpl/components/groom.html'"></div>
       </div>
   </div>
    <!--首页推荐不存在-->
    <div class="" ng-if="childGetMouds.length==0">
        <div class="conWidth" style="width: 100%">
            <div ng-repeat="item in specDetaiDataColumns track by $index">
                <!--ng-repeat-->
                <div class="speclHeadTitl">
                    <span class="speclHeadTitl1">{{$index+1}}/{{specDetaiDataColumns.length}} {{item.columnName}}</span>
                    <span ng-click="jump('/detailSpec/'+item.columnId+'linkId'+speciParentColumnId)" class="speclHeadMor">更多</span>
                </div>
                <div ng-include="'tpl/components/detailSpeFouTwo.html'"></div>
            </div>
        </div>
    </div>

</div>

<style>
    .speciHeader{
        /*overflow: hidden;*/
    }
    .speciHeader li{
        float: left;
    }
    .speclHeadImg{
        width: 100%;
    }
    .speclHeadImg img{
        width: 100%;
        height: 1.9rem;
        border: 1px solid #eee;
    }
    .speclHeadText{
       background: #ffffff;
       padding: 0.15rem;
        width: 100%;
        height: 0.95rem;
        font-size: 0.16rem;
        color: #000000;
        overflow: scroll;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .speclHeadTitl{
        overflow: hidden;
        padding-bottom: 0.2rem;
        border-bottom:1px solid #e3e3e3;
        margin: 0 0.2rem;
    }
    .speclHeadTitl1{
        float: left;
        color: #000000;
        font-size: 0.24rem;

    }
    .speclHeadMor{
        float: right;
        color: #999999;
        font-size: 0.12rem;
    }
    .home-text div h3{
        font-size: 0.2rem;
        color: #000000;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    .home-text div span{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .home-text div h3,.home-text div span{
        margin-bottom: 0.15rem;
    }
    @media only screen and (min-width: 30.2rem){
        .mianConLeft{
            width: 100%;
            padding: 0 0.05rem;
        }
        .conGroomConti{
            width: 100%;
        }

    }
    @media only screen and (min-width: 640px){
        .mianConLeft{
            width: 100%;
            padding: 0 0.05rem;
        }
        .conGroomConti{
            width: 100%;
        }

    }
    @media only screen and (min-width: 768px){
        .mianConLeft{
            width: 100%;
            padding: 0 0.05rem;
        }
        .conGroomConti{
            width: 100%;
        }

    }
    @media only screen and (min-width: 1024px){
        .mianConLeft{
            width: 65%;
            padding: 0 0.05rem;
        }
        .conGroomConti{
            width: 33%;
        }

    }
    @media only screen and (min-width:1366px){
        .mianConLeft{
            width: 65%;
            padding: 0 0.05rem;
        }
        .conGroomConti{
            width: 33%;
        }

    }
</style>